<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // // 十行 十列
    // var str = ''

    // for(var i = 1; i <= 10; i++) {  // 十行
    //   for(var j = 0; j < 10; j++) {  // 控制每一行打印的 列数
    //     str += '⭐️'
    //   }

    //   str += '\n'  // new line  
    // }

    // console.log(str)




    // ⭐️⭐️⭐️⭐️
    // ⭐️⭐️⭐️
    // ⭐️⭐️
    // ⭐️

    //  我的行数 越大 我的 列数越 小  编程就是一个思路
    //  i 其实就是我的行， 也就是 i 越大， 我 里层for循环 就要执行的 次数 越少

    // // 倒  方法1
    // var str = ''

    // for(var i = 1; i <= 10; i++) {  // 十行

    //   for(var j = i; j <= 10; j++) {  // 控制每一行打印的 列数
    //     str += '⭐️'
    //   }

    //   str += '\n'  // n 
    // }



    // 正三角形：  随着行数的增加， 我每一行的 列数 也增加了 ， 其实就是让里层for跟外层控制行的i产生关系
    //  也就是说， 正三角 的 里层的 for 循环的次数 要慢慢增加

    // 倒三角：  随着行数的增加， 每一行 列数 减少， 其实也是让 里层for跟外曾控制 行的i变量产生关系
     //  也就是说， 倒三角 的 里层的 for 循环的次数 要慢慢减少

    // 当 i=1 进入循环     j 需要循环 1次
    // 当 i=2 进入循环     j 需要 循环 2次
    // 当 i=3 进入循环     j 需要 循环 3次
    // 当 i=4 进入循环     j 需要 循环 7次
    // 当 i=5 进入循环     j 需要 循环 10次
    // 当 i=6  进入循环    j 需要 循环 10次
    // 当 i=7 进入循环     j 需要 循环 10次
    // 当 i=8  进入循环    j 需要 循环 10次
    // 当 i=9  进入循环    j 需要 循环 10次
    // 当 i=10  进入循环   j 需要 循环 10次


    // 第一行 1个
    // 第二行 2个
    // 第三行 3个
    // 第三行 4个
    // 第三行 5个
    var str = ''

    for (var i = 1; i <= 5; i++) {  // 十行

      for (var j = 1; j <= i; j++) {  // 控制每一行打印的 列数
        str += '⭐️'
      }
      str += '\n'  // n 
    }

    console.log(str)

  </script>
</body>

</html>